'use strict';
import React, { Component } from 'react';
import {
    Dimensions,
    StyleSheet,
    Text,
    Alert,
    TouchableHighlight,
    View
} from 'react-native';
import Camera from 'react-native-camera';

export default class MyCamera extends Component {

    //构造函数
    constructor(props) {
        super(props);
        this.state = {
            cameraType: Camera.constants.Type.back
        };
    }
    render() {
        return (
            <View style={styles.container}>
                <Camera
                    ref={(cam) => {
                        this.camera = cam;
                    }}
                    style={styles.preview}
                    type={this.state.cameraType}
                    aspect={Camera.constants.Aspect.fill}>
                    <Text style={styles.capture} onPress={this.switchCamera.bind(this)}>[切换摄像头]</Text>
                    <Text style={styles.capture} onPress={this.takePicture.bind(this)}>[拍照]</Text>
                </Camera>
            </View>
        );
    }


    //切换前后摄像头
    switchCamera() {
        let state = this.state;
        if(state.cameraType === Camera.constants.Type.back) {
            state.cameraType = Camera.constants.Type.front;
        }else{
            state.cameraType = Camera.constants.Type.back;
        }
        this.setState(state);
    }
    takePicture() {
        const options = {};
        //options.location = ...
        this.camera.capture({metadata: options})
            .then((data) => {
                Alert.alert(
                    'Success',
                    "拍照成功！图片保存地址：\n"+data.path,
                )
        })
            .catch(err => console.error(err));
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        flexDirection: 'row',
    },
    preview: {
        flex: 1,
        justifyContent: 'space-between',
        alignItems: 'flex-end',
        flexDirection: 'row',
    },
    capture: {
        flex: 0,
        backgroundColor: '#fff',
        borderRadius: 5,
        color: '#000',
        padding: 10,
        margin: 40
    }
});
